5-3 扩展集成第三方插件uview-plus(配置alias)
uview-plus 简介
uview-plus 是 uni-app 生态中最流行的 UI 组件库,提供 70+ 个精美组件,支持 Vue 3。
安装
npm install uview-plus
bash
配置
1. main.js 引入
import uviewPlus from 'uview-plus'
app.use(uviewPlus)
javascript
2. 引入样式
// App.vue
<style lang="scss">
@import 'uview-plus/index.scss';
</style>
javascript
3. 配置 easycom
// pages.json
{
"easycom": {
"custom": {
"^u-(.*)": "uview-plus/components/u-$1/u-$1.vue"
}
}
}
json
4. 配置 alias(Vite 项目)
// vite.config.js
import { defineConfig } from 'vite'
export default defineConfig({
resolve: {
alias: {
'@': '/src',
'@uview-plus': 'uview-plus'
}
}
})
javascript
使用组件
<template>
<u-button type="primary">按钮</u-button>
<u-input v-model="value" placeholder="请输入" />
</template>
html
参考资源
↑